import { Component, LogicRender } from 'refast';
import { withRouter } from 'react-router';
// import SearchWord from 'components/search-word';
import SearchData from 'components/search-data';
import SearchStations from 'components/stations';
import './PageLine.less';
import logic from './logic';

class PageLine extends Component {

  constructor(props) {
    super(props, logic);
    this.handleChange = this.handleChange.bind(this);
    this.searchRoutes = this.searchRoutes.bind(this);
    this.searchClick = this.searchClick.bind(this);
  }

  handleChange(e) {
    let { state: { city } } = this;
    this.setState({
      value: e.target.value,
    });
    this.execute('updateState', { keyword: e.target.value, city });
  }

  searchClick() {
    let { state: { city, value } } = this;
    this.execute('updateState', { keyword: value, city });
  }

  searchRoutes(k) {
    let { state: { city } } = this;
    this.execute('updateState', { keywords: k, city });
  }

  render() {
    const {
      state: { data, keyword, value, keywords, empty, show, stations, realData },
      props: { city },
      handleChange,
      searchRoutes,
    } = this;
    return (
      <div className="page-demo">
        <div className="line-head">
          <label htmlFor="" className="title">线路搜索</label>
          <input
            className="kuma-input"
            onChange={handleChange}
            placeholder="请输入路线"
            value={value}
          />
          <span onClick={this.searchClick}><i className="kuma-icon kuma-icon-search"></i></span>
        </div>
        <LogicRender show={!show} empty={empty} awareOf={{ keyword }} action="search">
          <SearchData action={searchRoutes} data={data} realData={realData} />
        </LogicRender>
        <LogicRender show={show} awareOf={{ keywords }} action="searchRoutes">
          <SearchStations stations={stations} />
        </LogicRender>
      </div>
    );
  }
  componentWillReceiveProps(nextProps) {
    let t = this;
    if (t.state.city != nextProps.city) t.setState({ city: nextProps.city });

  }
}
export default withRouter(PageLine);


